<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        div {
            border: 1px solid #ccc;
            text-align: center;
        }

        span {
            display: block;
        }

        li {
            list-style: none;
        }
    </style>
</head>

<body>
    <div>
    </div>
    <script>
        var obj = [{
            pid: 0,
            id: 1,
            name: "青花椒烤鱼",
            img: "./微信截图_20250403154359.png",
            price: 79,
        }, {
            pid: 0,
            id: 2,
            name: "咖喱给喱烤鱼",
            img: "./微信截图_20250403154605鱼肉.png",
            price: 79,
        }, {
            pid: 1,
            id: 3,
            name: "蒜你香专属大虾锅",
            img: "./微信截图_20250403154730虾仁.png",
            price: 89,
        }, {
            pid: 1,
            id: 4,
            name: "辣么麻专属大虾锅",
            img: "./微信截图_20250403154747虾仁2.png",
            price: 89,
        }, {
            pid: 2,
            id: 5,
            name: "大叉烤肉",
            img: "./微信截图_20250403155013烧烤.png",
            price: 29,
        }, {
            pid: 2,
            id: 6,
            name: "烤翅中",
            img: "./微信截图_20250403155021烧烤2.png",
            price: 12,
        }, {
            pid: 3,
            id: 7,
            name: "茴香小油条",
            img: "./微信截图_20250403155209油条.png",
            price: 12,
        }, {
            pid: 3,
            id: 8,
            name: "咖喱给喱烤鱼",
            img: "./微信截图_20250403155218酥肉.png",
            price: 22.8,
        }]
    </script>
    <!-- //jquery引入 -->
    <script src="https://code.jquery.com/jquery-3.7.1.js"></script>
    <script>
        var a = location.search.substring(4)
        console.log(a);
        
        var b = obj.find(item => item.id == a)
        $("div").html(`
            <li>
            <img src="${b.img}" alt="">
            <span>${b.name}</span>
            <span>$${b.price}</span>
        </li>
        `)
    </script>
</body>

</html>